<{extends "../Layout/default.html"}>
<{block name="main"}>
<div class="weui-toptips weui-toptips_warn" <{if !empty($errors)}>style="display: block;"<{/if}>><{$errors[0]}></div>
<form method="post">
    <div class="formpage">
        <section>
            <div class="weui-cells weui-cells_form">
                <div class="weui-cell">
                    <div class="weui-cell__hd">
                        <label class="weui-label weui-label-5em">手机号:</label>
                    </div>
                    <div class="weui-cell__bd">
                        <input class="weui-input" name="data[mobile]" value="<{$data.mobile}>" type="text" placeholder="请输入手机号">
                    </div>
                </div>

                <div class="weui-cell weui-cell_vcode">
                    <div class="weui-cell__hd">
                        <label class="weui-label  weui-label-5em">验证码:</label>
                    </div>
                    <div class="weui-cell__bd">
                        <input class="weui-input" name="data[code]" type="tel" placeholder="请输入验证码">
                    </div>
                    <div class="weui-cell__ft">
                        <!--<button class="weui-vcode-btn ">获取验证码</button>-->
                        <button type="button" class="weui-vcode-btn_cus weui-btn weui-btn_mini weui-btn_primary" id="getcode">获取验证码</button>
                    </div>
                </div>

            </div>
        </section>

        <div class="weui-btn-area mt_9rem">
            <input type="hidden" name="complete" value="1">
            <button class="weui-btn weui-btn_primary" id="">提交</button>
        </div>
    </div>
</form>
<script>
    $(".input-mask").on("change", function () {
        var id = $(this).data("target")
        $(id).val($(this).val())
    })

    $("#getcode").click(function () {
        var mobile = $('input[name="data[mobile]"]').val();
        var obj = $(this);
        if (/^1\d{10}$/.test(mobile)) {
            $.get('/base/getCode', {mobile: mobile}, function (data) {
                if(data.status == 1){
                    obj.prop("disabled", true).addClass("weui-btn_disabled");
                    setBtnText(obj, 30)
                }else{
                    showError('验证码获取失败');
                }
            });
        } else {
            showError('手机号错误');
        }
    });

    function setBtnText($btn, time) {
        if (time < 1) {
            $btn.prop("disabled", false).text("重新获取").removeClass("weui-btn_disabled")
        } else {
            $btn.html(time + "s");
            setTimeout(function () {
                time--
                setBtnText($btn, time)
            }, 1000)
        }
    }
</script>
<{/block}>